import React from "react";
import { isValidArr } from "@/utils";
import { RankItemComp, RecordItemComp } from "@/components/pages/rank";

const pageName = "rank.list.mine";
const klassName = pageName.replace(/\./g, '-');


export default function Comp({data, self}) {

  return (
    <div className={`cp-${klassName}`}>
      <div className="inner">
        <div className="cp-rank-columns">
          <div className="inner">
            <div className="rank">
              游戏时间
            </div>
            <div className="profile">
              次数来源
            </div>
            <div className="value">
              U电值
            </div>
          </div>
        </div>
        <div className="content">
          {
            isValidArr(data) ?
              data.map((item, index) => {
                if (item.rank <= 3) return null;
                return (
                  <RecordItemComp self={self?.rank === item?.rank} item={item} key={index} />
                )
              })
              :
              <div className="text-center p-3">
                无
              </div>
          }
          {/*{*/}
          {/*  self && self.rank > 3 &&*/}
          {/*  <RankItemComp self item={self} />*/}
          {/*}*/}

        </div>
      </div>
    </div>
  )
}